<template>
    <!-- 复制栏目弹窗 -->
  <el-dialog v-model="visible" title="选择名称规则" @close="cancel" width="30%">
    <el-radio-group v-model="radio">
    <el-radio value="1">添加当前日期</el-radio>
    <el-radio value="2">添加编号</el-radio>
    <el-radio value="3">自定义后缀</el-radio>
  </el-radio-group>
  <el-input v-if="radio === '3'" v-model="suffix" style="width: 240px;"></el-input>
    <template #footer>
      <el-button @click="cancel()">取消</el-button>
      <el-button type="primary" @click="submit()">确定</el-button>
    </template>
  </el-dialog>
</template>

<script setup lang="ts">
import { reactive, ref } from 'vue'
import { ElMessage } from 'element-plus/es'
const emit = defineEmits(['addOne'])
const visible = ref(false)

const init = (type: string, row: any) => {
	visible.value = true
}
const radio = ref('1')
const suffix = ref('')
const submit = () => {
    setTimeout(() => {
        visible.value = false
        ElMessage.success('复制成功')
        emit('addOne', radio.value, suffix.value)
    },500)
}
const cancel = () => {
	visible.value = false
}

defineExpose({
	init
})
</script>
<style lang="scss" scoped>
.inp-width {
	width: 220px;
}
.el-radio.is-bordered.el-radio--large {
	height: auto;
}
::v-deep(.avatar-uploader .el-upload) {
	border: 2px dashed #d9d9d9;
	border-radius: 6px;
	cursor: pointer;
	position: relative;
	overflow: hidden;
}
::v-deep(.avatar-uploader .el-upload:hover) {
	border-color: #409eff;
}
::v-deep(.avatar-uploader-icon) {
	font-size: 28px;
	color: #8c939d;
	width: 150px;
	height: 150px;
	line-height: 150px;
	text-align: center;
}
::v-deep(.avatar) {
	width: 150px;
	height: 150px;
	display: block;
}
</style>
